<!-- Copyright (c) 2014 The Chromium Authors. All rights reserved.
     Use of this source code is governed by a BSD-style license that can be
     found in the LICENSE file. -->
<!doctype html>
<html>
  <head>
    <title>{{ tree }} Tree Status</title>
    <link href='//fonts.googleapis.com/css?family=RobotoDraft:regular,bold,italic,thin,light,bolditalic,black,medium&lang=en' rel='stylesheet' type='text/css'>
    <script type='text/javascript' src='//www.google.com/jsapi'></script>
    <script src="/bower_components/webcomponentsjs/webcomponents.js"></script>
    <link rel="import" href="../lib/analytics.html">
    <script>
      var BUILD_DATA = {{ builds|safe }};
      var OFFENDER_DATA = {{ offenders|safe }};
      var SLO_BUILDTIME_MAX = {{ slo_buildtime_max|safe }};
    </script>
    <style type="text/css">
      body {
        font-family: 'RobotoDraft';
      }
      .chart {
        margin-bottom: 40px;
      }
    </style>
  </head>
  <body>
    <h1>{{ tree }} Build times</h1>

    <div class="chart" id="build-chart"></div>

    <h2>Offending Builds</h2>
    <p> List is here: <a href="/_ah/api/trooper_o_matic/v1/build_slo_offenders?tree={{ tree_key }}">offending builds</a></p>
    <div class="chart" id="offender-chart"></div>

    <script>
      google.load('visualization', '1.1', {'packages':['corechart']});
      google.setOnLoadCallback(drawCharts);
      function drawCharts() {
        drawBuildChart(BUILD_DATA, 'build-chart');
        drawOffenderChart(OFFENDER_DATA, 'offender-chart');
      }
      function drawBuildChart(data, id) {
        var dataTable = new google.visualization.DataTable(data);
        var chart = new google.visualization.ColumnChart(
            document.getElementById(id));
        chart.setAction({
          id: 'details',
          text: 'Build Details',
          action: function() {
            selection = chart.getSelection();
            if (!selection)
              return;
            var key = BUILD_DATA.rows[selection[0].row].c[0].key;
            window.open('/build-details/' + key);
          }
        })
        var options = {
          tooltip: {
            isHtml: true,
            trigger: 'selection'
          },
          focusTarget: 'category',
          isStacked: true,
          colors: ['green', 'yellow', 'red']
        };

        chart.draw(dataTable, options);
      }
      function drawOffenderChart(data, id) {
        var dataTable = new google.visualization.DataTable();
        dataTable.addColumn({id: 'timestamp', label: 'Time', type: 'datetime'});
        dataTable.addColumn({id: 'buildtime', label: 'Build Time', type: 'number'});
        dataTable.addColumn({role: 'scope', type: 'boolean'});
        dataTable.addColumn({role: 'tooltip', type: 'string'});
        dataTable.addRows(data.map(function(row) {
          var master = row[2];
          var builder = row[3];
          var buildnumber = row[4];
          var tooltip = master + ' / ' + builder + ' / ' + buildnumber;
          return [
            new Date(row[0]),
            row[1] / 60,
            row[1] > 60 * 60,
            tooltip,
          ];
        }));

        var chart = new google.visualization.ScatterChart(
            document.getElementById(id));
        chart.setAction({
          id: 'details',
          text: 'Build Details',
          action: function() {
            selection = chart.getSelection();
            if (!selection)
              return;
            var item = data[selection[0].row];
            var master = item[2];
            var builder = item[3];
            var buildnumber = item[4];
            var url = 'http://build.chromium.org/p/MASTER/builders/BUILDER/builds/NUM'.
                replace('MASTER', master).
                replace('BUILDER', builder).
                replace('NUM', buildnumber);
            window.open(url);
          }
        });
        var options = {
          tooltip: {
            isHtml: true,
            trigger: 'selection'
          },
        };

        chart.draw(dataTable, options);
      }
    </script>
    <script> new Analytics('UA-55762617-7'); </script>
  </body>
</html>
